<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<th:block th:replace="tpl :: common_head()"></th:block>
		<title>权限管理</title>
		<style>
		.panel{display:table;}
		.panel-left,.panel-right{display: table-cell;*display:inline-block;}
		.panel-left{width:700px;}
		.panel-left .info li{padding:8px;line-height:26px;color:#666;border-bottom:solid 1px #eaeaea;}
		.panel-right{width:200px;border-left:solid 1px #e7e7eb;line-height:32px;}
		.panel-right ul{border-bottom:solid 1px #e7e7eb;}
		.panel-right input[type=radio]{display:none;}
		.panel-right label{display:block;padding-left:32px;cursor:pointer;}
		.panel-right label:hover{background:#f4f5f9;}
		.panel-right input[type=radio]:checked + label{background:#f4f5f9;}
		.operation{background: #f4f5f9;line-height:42px;height:42px;}
		.i-btn{line-height:26px;display:inline-block;margin-left:12px;border:solid 1px #dddddd;background:white;padding:0 16px;color:#666;cursor:pointer;}
		.i-btn:hover{background:#e7e7eb;}
		.i-btn.disabled{background:#dddddd;color:white;}
		#edit{color:#459ae9;cursor:pointer;text-decoration: none;}
		</style>
	</head>
	<body th:with="entrance='/system/permission/index'">
		<th:block th:replace="tpl :: common_body(~{::.main-right})">
		<div class="main-right">
			<h1 class="main-right-h1">权限管理</h1>
			<ul class="main-right-tab">
				<li class="selected">权限列表</li>
			    <li><a href="0">新增域</a></li>
			</ul>
			<form class="panel">
				<div class="panel-left">
					<div style="line-height:42px;padding-left:16px;">
						<th:block th:if="${targetDomain!=null}">
							域名称：[[${targetDomain}]]&emsp;<a id="edit" th:href="${targetDomain}">修改</a>
						</th:block>
						<th:block th:if="${targetDomain==null}">暂无许可列表</th:block>
					</div>
					<div class="operation"></div>
					<ul class="info" th:with="subPermission=${permissions.?[domain!=null and domain.equals(#root.targetDomain)]}">
						<li th:each="p:${subPermission}" >
							<span style="color:#333;">[[${p.name}]]</span><br>
							备注：[[${p.description}]]
						</li>
					</ul>
				</div>
				<div class="panel-right">
					<ul>
						<li th:each="domain:${domains}">
							<input th:id="'domain'+${domain}" type="radio" name="targetDomain" th:value="${domain}" th:checked="${domain==targetDomain}" />
							<label th:for="'domain'+${domain}" th:text="${domain}"></label>
						</li>
					</ul>
				</div>
			</form>
		</div>
		</th:block>
		<script>
			$(function(){
				$(".panel-right input[type=radio]").change(function(){
					$("form").submit();
				})
			});
		</script>
	</body>
</html>